
<template>
  <div>
    <Form ref="form"></Form>
    <ZgCondition
      ref="condition"
      :labelCol="6"
      :columnCol="6"
      :showFilterAdminBtn="false"
      :uniqueName="'test'"
      :conditions="conditions"
      :showInlineBtn="false"
      :currFilterName="''"
      :extraBtns="extraBtns"
      @extraBtnClick="onExtraBtnClick"
      @search="search"
      @refresh="initFilters"
      @height="70"></ZgCondition>
    <a-table bordered :columns="columns" :data-source="data" />
  </div>
</template>
<script>
import ZgCondition from '@/comp/api/new/ZgCondition.vue'
import Form from './Form.vue'
export default {
  components: { ZgCondition, Form },
  data () {
    return {
      uniqueName: 'test',
      columns: [
        {
            title: '接口名称',
            dataIndex: 'name',
            key: 'name'
        },
        {
            title: '接口状态',
            dataIndex: 'state',
            key: 'state',
            width: '12%'
        },
        {
            title: '接口地址',
            dataIndex: 'address',
            width: '30%',
            key: 'address'
        },
        {
            title: '操作权限',
            dataIndex: 'power',
            width: '20%',
            key: 'power'
        }
      ],
      data: [
          {
              key: 1,
              name: '交易系统.',
              state: '正常',
              address: '192.179.1.222',
              power: 'all',
              children: [
              {
                  key: 11,
                  name: '交易门户.',
                  state: '正常',
                  address: '192.179.1.222',
                  power: 'all'
              }]
          },
          {
              key: 2,
              name: '交易系统App.',
              state: '正常',
              address: '192.179.1.222',
              power: 'all',
              children: [
              {
                  key: 21,
                  name: '交易.',
                  state: '正常',
                  address: '192.179.1.222',
                  power: 'all'
              }]
          }
      ],
      conditions: [
        { code: 'select', compType: '下拉选择', label: '系统', defaultVal: '1', extra: { 下拉选项: [{ value: '1', label: '系统A' }, { value: '2', label: '系统b' }] } },
        { code: 'name', compType: '单行文本', label: '接口名称', defaultVal: '', extra: { placeholder: '请输入接口名称' } }
      ],
      extraBtns: [
        { key: 1, name: '新增', icon: 'plus-circle', type: 'primary' }
      ]
    }
  },
  methods: {
    search (params) {
      console.log('查询', params)
    },
    initFilters (f, param) {
    },
    onExtraBtnClick () {
      this.$refs.form.open('add')
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
